<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title>Search Iterm</title>
	<link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css" />
	<link rel="stylesheet" href="css/SearchAnything.css" />
    <script type="text/javascript"  src="js/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="js/jquery.mobile-1.3.2.min.js"></script>
	
	
  <script type="text/javascript">
  $(document).ready(function(){
 	 $.mobile.ajaxEnabled = false;
 		 	
  });
	
  
  $(document).on('pageshow','.searchanything',function(){
		
	  $('#searchButtonId').bind('click',function(){
			if($('.searchTextBoxId').val().trim() != ""){
				$('#formsearch').submit();
				
			}else{
				var searchby = $('#searchby').val();
				var str="";
				var sugList=$('.sugList');		    	
                $.get("http://server:8080/parvati/Getnameservlet",{methodetocall:'getsearch',name:"",searchby:searchby},function(res,code){
					for(var i = 0;i<res.split('#').length-1;i++)
						str += "<li><a href=javascript:addtosearchinputname('"+res.split('#')[i]+"')>"+res.split('#')[i]+"</a></li>"; 					 	
					 sugList.html(str);
		             sugList.listview("refresh");
	            });
													
			}	
	 	 });
		
	  $('#searchDiv').hide();
	  
	  $('.serchById').change(function(){
	  
	  var placeholderText="Please Enter "+$('.serchById').val()+" for search...";
	  
	  
		if($('.serchById').val()=="date"){
		
		placeholderText="Please Enter "+$('.serchById').val()+" in ddmmyyyy format for search...";
		
		}
		
	   $('.searchTextBoxId').attr('placeholder',placeholderText);
	   $('#searchDiv').show();
	   
	  
	  });
	  
	    $(".searchTextBoxId").on("input", function(e) {
			var sugList=$('.sugList');
	    	var str="";
	        var text = $(this).val();
	        var searchby = $('#searchby').val();
	        if(text.length < 1) {
	            sugList.html("");
	            sugList.listview("refresh");
	        } else {
	                $.get("http://server:8080/parvati/Getnameservlet",{methodetocall:'getsearch',name:text,searchby:searchby},function(res,code){
						for(var i = 0;i<res.split('#').length-1;i++)
							str += "<li><a href=javascript:addtosearchinputname('"+res.split('#')[i]+"')>"+res.split('#')[i]+"</a></li>"; 
						 	
						 sugList.html(str);
			             sugList.listview("refresh");
		            });
	               
	        }
					
			});
	    });

  	function addtosearchinputname(name){
  		$(".searchTextBoxId").val(name);
  		$('.sugList').html("");		
	}
  </script>
 </head>
 <body>
  <div data-theme="c" data-role="page" class="searchanything">  
   <div data-position="fixed" data-role="header" data-theme="b">   
    <a href="menudisplay" data-role="buttun" data-icon="home">Menu</a>
    <h1>  
     Search Page
    </h1>  
   </div>  
   <div align="center" data-role="content">
   <h1>PARVATI SOLVENTS EXTRACTION PVT LTD</h1>
			<h3>GUT NO.76, KHADGAON,TALUKA: BADNAPUR,DISTRICT:JALNA-431203,MAHARASHTRA,INDIA</h3>
   <form action="getdealerdata" method="POST" id="formsearch">
    <input type="hidden" name="startDate"/>
    <input type="hidden" name="endDate"/>
    <div id="serachContainerDivId" style="width:50%;">
     <select name="serchBy" class="serchById" data-native-menu="false" tabindex="-1" id="searchby">
     <option value="">please select search criteria</option>
     <option value="broker">Broker</option>
     <option value="commisionAgent">Commition Agent</option>
     <option value="customer">Customer</option>
     <option value="city">City</option>
     <option value="district">District</option>
	 
    </select>
    </div>
    <br/>
    <s:if test="hasActionErrors()">
			<div class="errors" style="color: red;">
				<s:actionerror />
			</div>
	</s:if>
    <div id="searchDiv">
    <div class="searchTextBoxDivId" style="width:50%;">
 			
     <input class="searchTextBoxId" name="searchText" type="text" value=""/>
    </div> 
    <div id="searchButtonDivId" style="width:35%;" >
     <button id="searchButtonId"  type="button" >submit</button>
    </div> 
    <br/><br/>
     <ul data-role="listview" class="sugList" style="width: 30%;"  data-inset="true">
     
     </ul>
     </div>
   </form>
  </div>
  </div>
    </body>
</html>